<!--<template>-->
<!--    <section>-->
<!--        &lt;!&ndash;工具条&ndash;&gt;-->
<!--        <el-col :span="24" class="toolbar" style="padding-bottom: 0;">-->
<!--            <el-form :inline="true" :model="filters" style="display: flex">-->
<!--                <div style="display: flex;flex: 1">-->
<!--                    <el-form-item>-->
<!--                        <el-button @click="reloadPage">刷新</el-button>-->
<!--                    </el-form-item>-->
<!--                    &lt;!&ndash;                    <el-form-item>&ndash;&gt;-->
<!--                    &lt;!&ndash;                        <el-button type="warning" :disabled="checkedList.length===0" @click="putawayAll('down')">上架</el-button>&ndash;&gt;-->
<!--                    &lt;!&ndash;                    </el-form-item>&ndash;&gt;-->
<!--                    <el-form-item>-->
<!--                        <el-button type="danger" :disabled="checkedList.length===0" @click="completely">彻底删除</el-button>-->
<!--                    </el-form-item>-->
<!--&lt;!&ndash;                    <el-form-item>&ndash;&gt;-->
<!--&lt;!&ndash;                        <el-button type="danger" :disabled="checkedList.length===0" @click="completely('recover')">恢复到仓库</el-button>&ndash;&gt;-->
<!--&lt;!&ndash;                    </el-form-item>&ndash;&gt;-->
<!--                </div>-->
<!--                <div>-->
<!--                    <el-form-item>-->
<!--                        <el-input v-model="filters.title" placeholder="快速查找活动"></el-input>-->
<!--                    </el-form-item>-->
<!--                    <el-form-item>-->
<!--                        <el-button type="primary" @click="lookForList">查询</el-button>-->
<!--                    </el-form-item>-->

<!--                    <el-form-item>-->
<!--                        <el-button type="primary" @click="$router.push({path: '/goodsadd'})">添加活动</el-button>-->
<!--                    </el-form-item>-->
<!--                </div>-->
<!--            </el-form>-->

<!--        </el-col>-->

<!--        &lt;!&ndash;列表&ndash;&gt;-->
<!--        <template>-->
<!--            <el-table :data="goods" v-loading="loading" stripe style="width: 100%;"@selection-change="handleSelectionChange">-->
<!--                <el-table-column type="selection" width="55">-->
<!--                </el-table-column>-->
<!--                <el-table-column type="index" width="60">-->
<!--                </el-table-column>-->
<!--                <el-table-column prop="displayorder" label="排序" width="100" sortable>-->
<!--                </el-table-column>-->
<!--                <el-table-column label="头图" width="80">-->
<!--                    <template scope="scope">-->
<!--                        <img :src="scope.row.banner" class="head_pic" />-->
<!--                    </template>-->
<!--                </el-table-column>-->
<!--                &lt;!&ndash;				prop="title"&ndash;&gt;-->
<!--                <el-table-column label="名称" sortable>-->
<!--                    <template slot-scope="scope">-->
<!--                        <el-input @blur="updateTitle" autofocus v-if="scope.row.isShowInput" v-model="scope.row.title" placeholder="请输入内容" style="width: 50%"></el-input>-->
<!--                        <span style="color: #337ab7;" v-else @click="activeInput(scope.$index, scope.row)">{{scope.row.title}}</span>-->
<!--                    </template>-->
<!--                </el-table-column>-->
<!--                <el-table-column prop="price" label="价格" width="100" sortable>-->
<!--                    <template slot-scope="scope">-->
<!--                        <el-input @blur="updateTitle" autofocus v-if="scope.row.isShowInput1" v-model="scope.row.price" placeholder="请输入内容" style="width: 100%"></el-input>-->
<!--                        <span style="color: #337ab7;" v-else @click="activeInputOne(scope.$index, scope.row)">{{scope.row.price}}</span>-->
<!--                    </template>-->
<!--                </el-table-column>-->
<!--                <el-table-column prop="total" label="限额" width="100" sortable>-->
<!--                </el-table-column>-->
<!--                <el-table-column prop="sales" label="已报名" width="100" sortable>-->
<!--                </el-table-column>-->
<!--&lt;!&ndash;                <el-table-column label="状态" width="100" >&ndash;&gt;-->
<!--&lt;!&ndash;                    <template slot-scope="scope">&ndash;&gt;-->
<!--&lt;!&ndash;                        <el-button :type="miStatusColor(scope.row.status)" size="mini" @click="handleSta(scope.$index, scope.row)">{{ formatSta(scope.row) }}</el-button>&ndash;&gt;-->
<!--&lt;!&ndash;                    </template>&ndash;&gt;-->
<!--&lt;!&ndash;                </el-table-column>&ndash;&gt;-->
<!--                <el-table-column label="操作"  width="150">-->
<!--                    <template slot-scope="scope">-->
<!--                        <el-button size="mini" @click="handleEdit(scope.$index, scope.row)" icon="el-icon-edit" circle></el-button>-->
<!--                        <el-button size="mini" @click="handleRecycle(scope.$index, scope.row)" circle><i class="fa fa-reply-all" aria-hidden="true"></i></el-button>-->
<!--&lt;!&ndash;                        <el-button size="mini" @click="handleqrcode(scope.$index, scope.row)" icon="fa fa-qrcode" circle></el-button>&ndash;&gt;-->
<!--&lt;!&ndash;                        <el-button size="mini" @click="handlelist(scope.$index, scope.row)" icon="fa fa-list" circle></el-button>&ndash;&gt;-->
<!--                        <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)" icon="el-icon-delete" circle></el-button>-->
<!--                    </template>-->
<!--                </el-table-column>-->
<!--            </el-table>-->
<!--            &lt;!&ndash; 页码 &ndash;&gt;-->
<!--            <el-col :span="24" class="toolbar">-->
<!--                &lt;!&ndash;            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"&ndash;&gt;-->
<!--                &lt;!&ndash;                           :page-sizes="pageSizes" :page-size="PageSize" layout="total, sizes, prev, pager, next, jumper" :total="totalCount">&ndash;&gt;-->
<!--                &lt;!&ndash;            </el-pagination>&ndash;&gt;-->
<!--                <el-pagination-->
<!--                        @size-change="handleSizeChange"-->
<!--                        @current-change="handleCurrentChange"-->
<!--                        :current-page="currentPage"-->
<!--                        :page-sizes="pageSizes"-->
<!--                        :page-size="pageSize"-->
<!--                        layout="total, sizes, prev, pager, next, jumper"-->
<!--                        :total="totalCount">-->
<!--                </el-pagination>-->
<!--            </el-col>-->
<!--        </template>-->

<!--    </section>-->
<!--</template>-->
<!--<script>-->
<!--    import { getActiveList,soldOutDelete,editActive,recover,completelyAll } from '../../api/goodsAPI'-->
<!--    export default {-->
<!--        data() {-->
<!--            return {-->
<!--                totalCount: 0, // 总共多少条-->
<!--                pageSize: 10, // 每页显示条目个数-->
<!--                pageSizes: [10, 20, 30, 40], // 每页显示个数选择器的选项设置-->
<!--                currentPage: 1, // 当前页数-->
<!--                filters: {-->
<!--                    title: '' // 查询的关键字-->
<!--                },-->
<!--                loading: false,-->
<!--                miStatusColor: function(val) {-->
<!--                    if (val === 1) {-->
<!--                        return 'primary'-->
<!--                    } else {-->
<!--                        return 'warning'-->
<!--                    }-->
<!--                },-->
<!--                goods: [], // 活动列表-->
<!--                checkedList: [], // 选中的活动列表-->
<!--                titleName: '', // 名称-->
<!--                presentObj: {}, // 修改的当前对象-->
<!--            }-->
<!--        },-->
<!--        methods: {-->
<!--            activeInput(index, row) {-->
<!--                this.goods.forEach(i => {-->
<!--                    i.isShowInput = false-->
<!--                })-->
<!--                row.isShowInput = true;-->
<!--                console.log(row)-->
<!--                this.presentObj = row-->
<!--            },-->
<!--            activeInputOne(index, row) {-->
<!--                this.goods.forEach(i => {-->
<!--                    i.isShowInput1 = false-->
<!--                })-->
<!--                row.isShowInput1 = true;-->
<!--                console.log(row)-->
<!--                this.presentObj = row-->
<!--            },-->
<!--            // 修改名称-->
<!--            updateTitle() {-->
<!--                console.log(this.presentObj)-->
<!--                editActive(this.presentObj).then(res => {-->
<!--                    this.goods.forEach(i => {-->
<!--                        i.isShowInput = false-->
<!--                        i.isShowInput1 = false-->
<!--                    })-->
<!--                    this.$message({-->
<!--                        message: '修改成功',-->
<!--                        type: 'success'-->
<!--                    })-->
<!--                })-->
<!--            },-->
<!--            // 分页的-->
<!--            handleSizeChange(val) {-->
<!--                console.log(`每页 ${val} 条`);-->
<!--                // 改变每页显示的条数-->
<!--                this.pageSize = val;-->
<!--                this._getactivity()-->
<!--                // 注意：在改变每页显示的条数时，要将页码显示到第一页-->
<!--                this.currentPage = 1-->
<!--            },-->
<!--            // 分页的-->
<!--            handleCurrentChange(val) {-->
<!--                console.log(`当前页: ${val}`);-->
<!--                this.currentPage = val;-->
<!--                this._getactivity()-->
<!--            },-->
<!--            // 刷新页面-->
<!--            reloadPage() {-->
<!--                // window.location.reload(); // 刷新当前页面-->
<!--                location.reload();-->
<!--            },-->
<!--            // 打钩的事件-->
<!--            handleSelectionChange(val) {-->
<!--                this.checkedList = val;-->
<!--                console.log(val)-->
<!--            },-->
<!--            // 查询点击-->
<!--            lookForList() {-->
<!--                this._getactivity()-->
<!--            },-->
<!--            // 批量上架-->
<!--            putawayAll(item) {-->
<!--                let ids = this.checkedList.map(item => item.id)-->
<!--                console.log(ids)-->
<!--                console.log(item)-->
<!--                let data = { ids: ids }-->
<!--                if (item === 'down') {-->
<!--                    data = { ...data, status: 1 }-->
<!--                    console.log(data)-->

<!--                    this.$confirm('确认上架吗？', '提示', {-->
<!--                        type: 'warning'-->
<!--                    }).then(() => {-->
<!--                        soldOutDelete(data).then(res => {-->
<!--                            this.$message({-->
<!--                                type: 'success ',-->
<!--                                message: '上架成功'-->
<!--                            });-->
<!--                            this._getactivity()-->
<!--                        })-->
<!--                    }).catch(() => {-->
<!--                        this.$message({-->
<!--                            type: 'info',-->
<!--                            message: '已取消'-->
<!--                        });-->
<!--                    });-->

<!--                } else {-->
<!--                    data = { ...data, delete: 1 }-->
<!--                    console.log(data)-->
<!--                    this.$confirm('确认删除吗？', '提示', {-->
<!--                        type: 'warning'-->
<!--                    }).then(() => {-->
<!--                        soldOutDelete(data).then(res => {-->
<!--                            this.$message({-->
<!--                                type: 'success ',-->
<!--                                message: '删除成功'-->
<!--                            });-->
<!--                            this._getactivity()-->
<!--                        })-->
<!--                    }).catch(() => {-->
<!--                        this.$message({-->
<!--                            type: 'info',-->
<!--                            message: '已取消'-->
<!--                        });-->
<!--                    });-->
<!--                }-->

<!--            },-->
<!--            //状态显示转换-->
<!--            formatSta(row, column) {-->
<!--                // return row.status === 1 ? '启用' : row.status === 0 ? '禁用' : '未知';-->
<!--                return row.status === 1 ? '上架' : row.status === 0 ? '下架' : '未知';-->
<!--            },-->
<!--            //获取活动列表-->
<!--            _getactivity() {-->
<!--                let params = {-->
<!--                    // page: this.page,-->
<!--                    // name: this.filters.name-->
<!--                    p: this.currentPage,-->
<!--                    length: this.pageSize,-->
<!--                    keyword: this.filters.title,-->
<!--                    recycle: 1-->
<!--                };-->
<!--                this.listLoading = true;-->
<!--                //NProgress.start();-->
<!--                getActiveList(params).then(res => {-->
<!--                    this.listLoading = false;-->
<!--                    res.data.list.forEach(obj => {-->
<!--                        obj.isShowInput = false-->
<!--                        obj.isShowInput1 = false-->
<!--                    })-->
<!--                    this.goods = res.data.list;-->
<!--                    this.totalCount = res.data.total-->
<!--                }).catch(err => {-->
<!--                    console.log(err)-->
<!--                })-->
<!--                // this.$axios.get("/api/admin/activity/list")-->
<!--                // .then(res=>{-->
<!--                // 	this.listLoading = false;-->
<!--                // 	this.goods=res.data.data.list;-->
<!--                // })-->
<!--                // .catch(err=>{-->
<!--                // 	console.log(err)-->
<!--                // })-->
<!--            },-->
<!--            // 下架和上架按钮-->
<!--            handleSta(index, row) {-->
<!--                console.log(row)-->
<!--                let text = "";-->
<!--                if (row.status === 1) {-->
<!--                    text = "确认下架？";-->
<!--                    this.$confirm(text, '提示', {-->
<!--                        confirmButtonText: '确定',-->
<!--                        cancelButtonText: '取消',-->
<!--                        type: 'warning'-->
<!--                    }).then(() => {-->
<!--                        let data = {-->
<!--                            ids: row.id,-->
<!--                            status: 0-->
<!--                        }-->
<!--                        soldOutDelete(data).then(res => {-->
<!--                            this.$message({-->
<!--                                type: 'success',-->
<!--                                message: '下架成功!'-->
<!--                            });-->
<!--                            this._getactivity()-->
<!--                        })-->
<!--                    }).catch(() => {-->
<!--                        this.$message({-->
<!--                            type: 'info',-->
<!--                            message: '已取消'-->
<!--                        });-->
<!--                    });-->
<!--                } else {-->
<!--                    text = "确认上架？";-->
<!--                    this.$confirm(text, '提示', {-->
<!--                        confirmButtonText: '确定',-->
<!--                        cancelButtonText: '取消',-->
<!--                        type: 'warning'-->
<!--                    }).then(() => {-->
<!--                        let data = {-->
<!--                            ids: row.id,-->
<!--                            status: 1-->
<!--                        }-->
<!--                        soldOutDelete(data).then(res => {-->
<!--                            this.$message({-->
<!--                                type: 'success',-->
<!--                                message: '上架成功!'-->
<!--                            });-->
<!--                            this._getactivity()-->
<!--                        })-->
<!--                    }).catch(() => {-->
<!--                        this.$message({-->
<!--                            type: 'info',-->
<!--                            message: '已取消'-->
<!--                        });-->
<!--                    });-->
<!--                }-->

<!--            },-->
<!--            // 编辑按钮-->
<!--            handleEdit(index, row) {-->
<!--                console.log(index, row);-->
<!--                this.$router.push({path: '/editActivity',query: {id: row.id}})-->
<!--            },-->
<!--            // 恢复已删除的活动-->
<!--            handleRecycle(index, row) {-->
<!--                console.log(index, row);-->
<!--                let data = {id: row.id}-->
<!--                this.$confirm('恢复该活动, 是否继续?', '提示', {-->
<!--                    confirmButtonText: '确定',-->
<!--                    cancelButtonText: '取消',-->
<!--                    type: 'warning'-->
<!--                }).then(() => {-->
<!--                    recover(data).then(res => {-->
<!--                        this.$message({-->
<!--                            type: 'success',-->
<!--                            message: '恢复成功!'-->
<!--                        });-->
<!--                        this._getactivity()-->
<!--                    })-->

<!--                }).catch(() => {-->
<!--                    this.$message({-->
<!--                        type: 'info',-->
<!--                        message: '已取消恢复'-->
<!--                    });-->
<!--                });-->
<!--            },-->
<!--            // 每行的 删除按钮 删除 单条数据-->
<!--            handleDelete(index, row) {-->
<!--                console.log(index, row);-->
<!--                let data = {-->
<!--                    ids: row.id,-->
<!--                    delete: 1-->
<!--                }-->
<!--                this.$confirm('确认删除, 是否继续?', '提示', {-->
<!--                    confirmButtonText: '确定',-->
<!--                    cancelButtonText: '取消',-->
<!--                    type: 'warning'-->
<!--                }).then(() => {-->
<!--                    completelyAll(data).then(res => {-->
<!--                        this.$message({-->
<!--                            type: 'success ',-->
<!--                            message: '删除成功'-->
<!--                        });-->
<!--                        console.log(data)-->
<!--                        this._getactivity()-->
<!--                    })-->
<!--                }).catch(() => {-->
<!--                    this.$message({-->
<!--                        type: 'info',-->
<!--                        message: '已取消删除'-->
<!--                    });-->
<!--                });-->
<!--            },-->
<!--            // 彻底删除-->
<!--            completely() {-->
<!--                let data = this.checkedList.map(res => item.id)-->
<!--                let params = { ids: data }-->
<!--                this.$confirm('全部彻底删除, 是否继续?', '提示', {-->
<!--                    confirmButtonText: '确定',-->
<!--                    cancelButtonText: '取消',-->
<!--                    type: 'warning'-->
<!--                }).then(() => {-->
<!--                    completelyAll(params).then(res => {-->
<!--                        this.$message({-->
<!--                            type: 'success ',-->
<!--                            message: '删除成功'-->
<!--                        });-->
<!--                        this._getactivity()-->
<!--                    })-->
<!--                }).catch(() => {-->
<!--                    this.$message({-->
<!--                        type: 'info',-->
<!--                        message: '已取消'-->
<!--                    });-->
<!--                });-->
<!--            }-->
<!--        },-->
<!--        created() {-->
<!--            this._getactivity();-->
<!--        },-->
<!--        mounted() {-->

<!--        }-->
<!--    };-->
<!--</script>-->

<!--<style scoped lang="scss">-->
<!--    @import '~scss_vars';-->

<!--    .head_pic {-->
<!--        width: 40px;-->
<!--        height: 40px;-->
<!--        padding: 1px;-->
<!--        border: 1px solid #ccc;-->
<!--        vertical-align: middle;-->
<!--        margin: 3px 0;-->
<!--    }-->
<!--    .el-table .cell {-->
<!--        padding: 3px;-->
<!--    }-->
<!--</style>-->
<template>
    <section>
        <!--工具条-->
        <el-col :span="24" class="toolbar" style="padding-bottom: 0;">
            <el-form :inline="true" :model="filters" style="display: flex">
                <div style="display: flex;flex: 1">
                    <el-form-item>
                        <el-button @click="reloadPage">刷新</el-button>
                    </el-form-item>
                    <!--                    <el-form-item>-->
                    <!--                        <el-button type="warning" :disabled="checkedList.length===0" @click="putawayAll('down')">上架</el-button>-->
                    <!--                    </el-form-item>-->
<!--                    <el-form-item>-->
<!--                        <el-button type="danger" :disabled="checkedList.length===0" @click="completely">彻底删除</el-button>-->
<!--                    </el-form-item>-->
                </div>
                <div>
                    <el-form-item>
                        <el-input v-model="filters.title" placeholder="快速查找活动"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="lookForList">查询</el-button>
                    </el-form-item>

                    <el-form-item>
                        <el-button type="primary" @click="$router.push({path: '/goodsadd'})">添加活动</el-button>
                    </el-form-item>
                </div>
            </el-form>

        </el-col>

        <!--列表-->
        <template>
            <el-table :data="goods" v-loading="loading" stripe style="width: 100%;"@selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55">
                </el-table-column>
                <!--				<el-table-column type="index" width="60">-->
                <!--				</el-table-column>-->
                <el-table-column prop="displayorder" label="排序" width="100" sortable>
                    <template slot-scope="scope">
                        <el-input @blur="updateTitle" autofocus v-if="scope.row.isShowInput2" v-model="scope.row.displayorder" placeholder="请输入内容" style="width: 100%"></el-input>
                        <span style="color: #337ab7;" v-else @click="activeIndex(scope.$index, scope.row)">{{scope.row.displayorder}}</span>
                    </template>
                </el-table-column>
                <el-table-column label="头图" width="80" style="padding-bottom: 15px;">
                    <template slot-scope="scope">
                        <img :src="scope.row.banner" class="head_pic" />
                    </template>
                </el-table-column>
                <!--				prop="title"-->
                <el-table-column label="名称" sortable>

                    <template slot-scope="scope">
                        <p class="merch">
                            <span style="background-color: #67C23A;padding: 2px 4px;color: #fff;border-radius: 3px;font-size: 10px">{{ scope.row.merch_name}}</span>
                            <span v-if="scope.row.settlement_status === 0" class="sta">未完结</span>
                            <span v-if="scope.row.settlement_status === 1" class="sta">已完结</span>
                            <span v-if="scope.row.settlement_status === 2" class="sta">已结算</span>
                            <br>
                            <el-input @blur="updateTitle" autofocus v-if="scope.row.isShowInput" v-model="scope.row.title" placeholder="请输入内容" style="width: 100%"></el-input>
                            <span style="color: #337ab7;" v-else @click="activeInput(scope.$index, scope.row)">{{scope.row.title}}</span>
                        </p>
                    </template>
                </el-table-column>
                <el-table-column prop="price" label="价格" width="100" sortable>
                    <template slot-scope="scope">
                        <el-input @blur="updateTitle" autofocus v-if="scope.row.isShowInput1" v-model="scope.row.price" placeholder="请输入内容" style="width: 100%"></el-input>
                        <span style="color: #337ab7;" v-else @click="activeInputOne(scope.$index, scope.row)">{{scope.row.price}}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="total" label="限额" width="100" sortable>
                </el-table-column>
                <el-table-column prop="sales" label="已报名" width="100" sortable>
                </el-table-column>
<!--                <el-table-column label="状态" width="100" >-->
<!--                    <template slot-scope="scope">-->
<!--                        <el-button :type="miStatusColor(scope.row.status)" size="mini" @click="handleSta(scope.$index, scope.row)">{{ formatSta(scope.row) }}</el-button>-->
<!--                    </template>-->
<!--                </el-table-column>-->
                <el-table-column label="操作"  width="150">
                    <template slot-scope="scope">
                        <el-tooltip class="item" effect="dark" content="编辑" placement="top">
                            <el-button size="mini" @click="handleEdit(scope.$index, scope.row)" icon="el-icon-edit" circle></el-button>
                        </el-tooltip>
                        <el-tooltip class="item" effect="dark" content="报名数据" placement="top">
                            <el-button size="mini" @click="handleRecycle(scope.$index, scope.row)" circle><i class="fa fa-reply-all" aria-hidden="true"></i></el-button>
                        </el-tooltip>
<!--                        <el-tooltip class="item" effect="dark" content="删除" placement="top">-->
<!--                            <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)" icon="el-icon-delete" circle></el-button>-->
<!--                        </el-tooltip>-->
                    </template>

                </el-table-column>

            </el-table>
            <!--			<div class="is-code" style="width: 100px;height: 100px;position: absolute;left: 0;top: 0;bottom: 0;right: 0;margin: auto;z-index: 9999">-->
            <!--				<img :src="code" alt="" style="width: 100%">-->
            <!--			</div>-->

            <!-- 页码 -->
            <el-col :span="24" class="toolbar">
                <!--            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"-->
                <!--                           :page-sizes="pageSizes" :page-size="PageSize" layout="total, sizes, prev, pager, next, jumper" :total="totalCount">-->
                <!--            </el-pagination>-->
                <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="currentPage"
                        :page-sizes="pageSizes"
                        :page-size="pageSize"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="totalCount">
                </el-pagination>
            </el-col>
        </template>

    </section>
</template>
<script>
    import { getActiveList,soldOutDelete,editActive, completelyAll, recover } from '../../api/goodsAPI'
    export default {
        data() {
            return {
                totalCount: 0, // 总共多少条
                pageSize: 10, // 每页显示条目个数
                pageSizes: [10, 20, 30, 40], // 每页显示个数选择器的选项设置
                currentPage: 1, // 当前页数
                filters: {
                    title: '' // 查询的关键字
                },
                loading: false,
                miStatusColor: function(val) {
                    if (val === 1) {
                        return 'primary'
                    } else {
                        return 'warning'
                    }
                },
                goods: [], // 活动列表
                checkedList: [], // 选中的活动列表
                titleName: '', // 名称
                presentObj: {}, // 修改的当前对象
                code: '' // 二维码
            }
        },
        methods: {
            activeIndex(index, row) {
                this.goods.forEach(i => {
                    i.isShowInput2 = false
                })
                row.isShowInput2 = true;
                console.log(row)
                this.presentObj = row
            },
            activeInput(index, row) {
                this.goods.forEach(i => {
                    i.isShowInput = false
                })
                row.isShowInput = true;
                console.log(row)
                this.presentObj = row
            },
            activeInputOne(index, row) {
                this.goods.forEach(i => {
                    i.isShowInput1 = false
                })
                row.isShowInput1 = true;
                console.log(row)
                this.presentObj = row
            },
            // 修改名称
            updateTitle() {
                console.log(this.presentObj)
                editActive(this.presentObj).then(res => {
                    this.goods.forEach(i => {
                        i.isShowInput = false
                        i.isShowInput1 = false
                        i.isShowInput2 = false
                    })
                    this.$message({
                        message: '修改成功',
                        type: 'success'
                    })
                    this._getactivity()
                }).catch(err => {
                    this.goods.forEach(i => {
                        i.isShowInput = false
                        i.isShowInput1 = false
                        i.isShowInput2 = false
                    })
                    this.$message({
                        message: err.response.data.message,
                        type: 'error'
                    })
                })
            },
            // 分页的
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
                // 改变每页显示的条数
                this.pageSize = val;
                this._getactivity()
                // 注意：在改变每页显示的条数时，要将页码显示到第一页
                this.currentPage = 1
            },
            // 分页的
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
                this.currentPage = val;
                this._getactivity()
            },
            // 刷新页面
            reloadPage() {
                // window.location.reload(); // 刷新当前页面
                location.reload();
            },
            // 打钩的事件
            handleSelectionChange(val) {
                this.checkedList = val;
                console.log(val)
            },
            // 查询点击
            lookForList() {
                this._getactivity()
            },
            // 批量上架
            putawayAll(item) {
                let ids = this.checkedList.map(item => item.id)
                console.log(ids)
                console.log(item)
                let data = { ids: ids }
                if (item === 'down') {
                    data = { ...data, status: 1 }
                    console.log(data)

                    this.$confirm('确认上架吗？', '提示', {
                        type: 'warning'
                    }).then(() => {
                        soldOutDelete(data).then(res => {
                            this.$message({
                                type: 'success ',
                                message: '上架成功'
                            });
                            this._getactivity()
                        }).catch(err => {
                            this.$message({
                                message: err.response.data.message,
                                type: 'error'
                            })
                        })
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消'
                        });
                    });

                } else {
                    data = { ...data, delete: 1 }
                    console.log(data)
                    this.$confirm('确认删除吗？', '提示', {
                        type: 'warning'
                    }).then(() => {
                        soldOutDelete(data).then(res => {
                            this.$message({
                                type: 'success ',
                                message: '删除成功'
                            });
                            this._getactivity()
                        }).catch(err => {
                            this.$message({
                                message: err.response.data.message,
                                type: 'error'
                            })
                        })
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消'
                        });
                    });
                }

            },
            //状态显示转换
            formatSta(row, column) {
                // return row.status === 1 ? '启用' : row.status === 0 ? '禁用' : '未知';
                return row.status === 1 ? '上架' : row.status === 0 ? '下架' : '未知';
            },
            //获取活动列表
            _getactivity() {
                let params = {
                    // page: this.page,
                    // name: this.filters.name
                    p: this.currentPage,
                    length: this.pageSize,
                    keyword: this.filters.title,
                    recycle: 1
                };
                this.listLoading = true;
                // NProgress.start();
                getActiveList(params).then(res => {
                    this.listLoading = false;
                    res.data.list.forEach(obj => {
                        obj.isShowInput = false
                        obj.isShowInput1 = false
                        obj.isShowInput2 = false
                    })
                    this.goods = res.data.list;
                    this.totalCount = res.data.total
                    console.log(this.goods)
                }).catch(err => {
                    this.$message({
                        message: err.response.data.message,
                        type: 'error'
                    })
                })
                // this.$axios.get("/api/admin/activity/list")
                // .then(res=>{
                // 	this.listLoading = false;
                // 	this.goods=res.data.data.list;
                // })
                // .catch(err=>{
                // 	console.log(err)
                // })
            },
            // 下架和上架按钮
            handleSta(index, row) {
                console.log(row)
                let text = "";
                if (row.status === 1) {
                    text = "确认下架？";
                    this.$confirm(text, '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        let data = {
                            ids: row.id,
                            status: 0
                        }
                        soldOutDelete(data).then(res => {
                            this.$message({
                                type: 'success',
                                message: '下架成功!'
                            });
                            this._getactivity()
                        }).catch(err => {
                            this.$message({
                                message: err.response.data.message,
                                type: 'error'
                            })
                        })
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消'
                        });
                    });
                } else {
                    text = "确认上架？";
                    this.$confirm(text, '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        let data = {
                            ids: row.id,
                            status: 1
                        }
                        soldOutDelete(data).then(res => {
                            this.$message({
                                type: 'success',
                                message: '上架成功!'
                            });
                            this._getactivity()
                        }).catch(err => {
                            this.$message({
                                message: err.response.data.message,
                                type: 'error'
                            })
                        })
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消'
                        });
                    });
                }

            },
            // 恢复已删除的活动
            handleRecycle(index, row) {
                console.log(index, row);
                let data = {id: row.id}
                this.$confirm('恢复该活动, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    recover(data).then(res => {
                        this.$message({
                            type: 'success',
                            message: '恢复成功!'
                        });
                        this._getactivity()
                    }).catch(err => {
                        this.$message({
                            message: err.response.data.message,
                            type: 'error'
                        })
                    })

                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消恢复'
                    });
                });
            },
            // 编辑按钮
            handleEdit(index, row) {
                console.log(index, row);
                this.$router.push({path: '/editActivity',query: {id: row.id}})
            },
            // 复制按钮
            handlecopy(index, row) {
                console.log(index, row)
                const input = document.createElement('input')
                document.body.appendChild(input)
                input.setAttribute('value', `https://mobile.laiba.shop/html/#/pages/active/detail?id=${row.id}`)
                input.select()
                if (document.execCommand('copy')) {
                    document.execCommand('copy')
                }
                document.body.removeChild(input)
                this.$message({
                    type: 'success',
                    message: '复制成功!'
                });
            },
            // 每行的 删除按钮 删除 单条数据
            handleDelete(index, row) {
                console.log(index, row);
                let data = {
                    ids: row.id,
                    delete: 1
                }
                this.$confirm('确认删除, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    completelyAll(data).then(res => {
                        this.$message({
                            type: 'success ',
                            message: '删除成功'
                        });
                        console.log(data)
                        this._getactivity()
                    }).catch(err => {
                        this.$message({
                            message: err.response.data.message,
                            type: 'error'
                        })
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                })
            },
            // 彻底删除
            completely() {
                let data = this.checkedList.map(res => item.id)
                let params = { ids: data }
                this.$confirm('全部彻底删除, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    completelyAll(params).then(res => {
                        this.$message({
                            type: 'success ',
                            message: '删除成功'
                        });
                        this._getactivity()
                    }).catch(err => {
                        this.$message({
                            message: err.response.data.message,
                            type: 'error'
                        })
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消'
                    });
                });
            },
            // 二维码点击事件
            handleqrcode(index, row) {
                console.log(index,row)
                this.code = row.qrcode
            },
            // 报名情况
            activityOrderList(index, row) {
                console.log(index,row)
                this.$router.push({path: '/activityOrder',query: {id: row.id}})
            }
        },
        created() {
            this._getactivity(); // 获取活动列表
        },

    };
</script>

<style scoped lang="scss">
    @import '~scss_vars';

    .head_pic {
        width: 40px;
        height: 40px;
        padding: 1px;
        border: 1px solid #ccc;
        vertical-align: middle;
        margin: 3px 0;
    }
    .el-table .cell {
        padding: 3px;
    }
    .sta {
        font-size: 10px;
        padding-left: 10px;
        padding-top: 2px;
        color: #67c23a;
    }
</style>
